<template>
    <div style="position: relative">
<!--                <div  class="state_info">{{state_map[state_code]}} &#45;&#45; {{stateType}}</div>-->
<!--        {{state_map[state_code].includes('驳回')}}-->
<!-- {{exam_org}} -->
<!-- {{is_pass}} -->
<!--      {{isExam}}{{stateStr}}-->
<!--      {{signed}}-->
        <div v-if="state_map[state_code].slice(0,4) == stateType" class="hover">
            <div v-if="user_type===2">
<!--                {{note}}-->
                <el-tooltip :disabled="note.replace('<已编辑>','') != '' && state_map[state_code].includes('驳回') ? false:true" class="item" effect="dark"
                            :content="`已被驳回,驳回原因:${note.replace('<已编辑>','')}`" placement="bottom">
                    <div v-if="stateStr==='orgWaiting_1'">
                        <div :style="state_map[state_code].includes('驳回') && !note.includes('已编辑') ? 'background-color: pink':state_map[state_code].includes('驳回') && note.includes('已编辑') ? 'background-color: #fbcf7f':''" style="display: flex;width: 100%;justify-content: space-around;">
                            <div class="checkButton" @click="org_reject_1">
                                <el-button class="stateButton" type="danger" size="mini" icon="el-icon-close"></el-button>
<!--                                <img src="../assets/check/error.png">-->
                            </div>
                            <div class="checkButton" @click="org_pass_1">
                                <el-button class="stateButton" type="success" size="mini" icon="el-icon-check"></el-button>
<!--                                <img src="../assets/check/success.png">-->
                            </div>
                        </div>
                    </div>
                </el-tooltip>
                <el-tooltip :disabled="note.replace('<已编辑>','') != '' && state_map[state_code].includes('驳回') ? false:true" class="item" effect="dark"
                            :content="`已被驳回,驳回原因:${note.replace('<已编辑>','')}`" placement="bottom">
                    <div v-if="stateStr==='orgWaiting_2'">
                        <div v-if="signed">
                          <div v-if="isExam !== null" :style="state_map[state_code].includes('驳回') && !note.includes('已编辑') ? 'background-color: pink':state_map[state_code].includes('驳回') && note.includes('已编辑') ? 'background-color: #fbcf7f':''" style="display: flex;width: 100%;justify-content: space-around;align-items: center;">
                            <div class="checkButton" @click="org_reject_2(isExam)">
                              <el-button class="stateButton" type="danger" size="mini" icon="el-icon-close"></el-button>
                            </div>
                            <div class="checkButton" @click="org_pass_2(isExam)">
                              <el-button class="stateButton" type="success" size="mini" icon="el-icon-check"></el-button>
                            </div>
                          </div>
                          <div v-if="isExam == null">
                            <el-tag type="warning">待报考</el-tag>
                          </div>
                        </div>
                      <div v-else>
                        <el-tag>合同未签署</el-tag>
                      </div>
                        <!-- <div v-if="isExam !== null">
                            <el-tag type="warning">待审</el-tag>
                        </div> -->
                    </div>
                </el-tooltip>
                <div v-if="stateStr==='adminWaiting_1'||stateStr==='adminWaiting_2'">
                    <el-tag type="warning">审核中</el-tag>
                </div>
            </div>
            <div v-if="user_type===3">
                <div v-if="stateStr==='adminWaiting_1'">
                    <div style="display: flex;width: 100%;justify-content: space-around;">
                        <div class="checkButton" @click="admin_reject_1">
                            <el-button type="danger" size="mini" icon="el-icon-close"></el-button>
                        </div>
                        <div class="checkButton" @click="admin_pass_1">
                            <el-button type="success" size="mini" icon="el-icon-check"></el-button>
                        </div>
                    </div>
                </div>
                <div v-if="stateStr==='adminWaiting_2'">
                    <div style="display: flex;width: 100%;justify-content: space-around;">
                        <div class="checkButton" @click="admin_reject_2">
                            <el-button type="danger" size="mini" icon="el-icon-close"></el-button>
                        </div>
                        <div class="checkButton" @click="admin_pass_2">
                            <el-button type="success" size="mini" icon="el-icon-check"></el-button>
                        </div>
                    </div>
                </div>
                <div v-if="stateStr==='orgWaiting_1'||stateStr==='orgWaiting_2'">
                    <el-tag v-if="isExam == null" type="warning">待报考</el-tag>
                    <el-tag v-if="isExam != null" type="warning">审核中</el-tag>
                </div>
            </div>
        </div>
        <div v-else>
            <!--            待审{{findkey}}--{{state_code}}-->
            <div v-if="state_code < findkey">
                <el-tag v-if="isExam != null">待审</el-tag>
                <el-tag type="warning" v-if="isExam == null">待报考</el-tag>
            </div>
            <div v-if="state_code > findkey">
                <el-tag type="success">通过</el-tag>
                <el-tag v-if="is_pass > 0" type="success">补考</el-tag>
            </div>
        </div>
        <el-dialog
                v-if="stateReject"
                title="驳回原因"
                :visible.sync="centerDialogVisible"
                width="30%"
                center>
            <el-input v-model="rejectContent"></el-input>
            <span slot="footer" class="dialog-footer">
            <el-button @click="close">取 消</el-button>
            <el-button type="primary" :disabled="rejectContent == '' ? true:false" @click="rejectSubmit">确 定</el-button>
          </span>
        </el-dialog>
    </div>
</template>

<script>
    import {check} from "../request/api";

    export default {
        name: "Item",
        props: {
          signed:{
            type:Boolean,
            default:false
          },
            exam_org:{
                type:Object,
                default:function(){
                    return {}
                }
            },
            state_code: {
                type: Number
            },
            pid: {
                type: Number
            },
            stateType: {
                type: String
            },
            note: {
                type: String,
                default: ''
            },
            is_pass:{
                type:Number,
                default:0
            },
            isExam:{
                type:String,
                default:''
            }
        },
        data() {
            return {
                stateReject: null,
                rejectContent: '',
                centerDialogVisible: false,
                // itemIsShow:false,
                state_map: {
                    0: '机构一审驳回',
                    1: '机构一审',
                    2: '机构一审驳回',
                    3: '总部一审',
                    4: '机构二审驳回',
                    5: '机构二审',
                    6: '机构二审驳回',
                    7: '总部二审',
                    8: '全部审核通过'
                },
                user_type: this.$store.state.user_type
            }
        },
        beforeCreate(){
            console.log('item',this.$store.state.user_type);
        },
        computed: {
            stateStr() {
                switch (this.state_code) {
                    case 0:
                        return 'orgWaiting_1';
                    case 1:
                        return 'orgWaiting_1';
                    case 2:
                        return 'orgWaiting_1';
                    case 3:
                        return 'adminWaiting_1';
                    case 4:
                        return 'orgWaiting_2';
                    case 5:
                        return 'orgWaiting_2';
                    case 6:
                        return 'orgWaiting_2';
                    case 7:
                        return 'adminWaiting_2';
                    case 8:
                        return 'allPass'

                }
                return null

            },
            findkey() {
                for (let item in this.state_map) {
                    if (this.stateType == this.state_map[item]) {
                        return item;
                    }
                }
                return null;
            },
            getuserType(){
                this.user_type = this.$store.state.user_type;
            }
        },
        methods: {
            close() {
                this.centerDialogVisible = false
            },
            rejectSubmit() {
                let params = {pid: this.pid, method: this.stateReject, note: this.rejectContent}
                console.log(params.note.length)
                if (params.note.length > 15) {
                    this.$message({
                        type: "error",
                        message: "驳回原因不能大于15个字符"
                    })
                    return;
                }
                check(params).then(res => {
                    console.log(res);
                    this.rejectContent = "";
                    this.close();
                    this.$emit('chekcSuccess')
                    this.$message({
                        type: 'success',
                        message: '驳回成功!'
                    });
                    if(params.method == 'org_reject_2' || params.method == 'admin_reject_2'){
                      let params = {pid: this.pid, method: 'contract_reject'}
                      check(params).then(res =>{
                        console.log('合同驳回',res);
                        this.$emit('loding',res)
                      })
                    }
                }).catch(err =>{
                  this.$message({type:'error',message:err.msg+'，'+err.errors})
                })
            },
            //机构一审驳回
            org_reject_1() {
                console.log('org_reject_1');
                this.stateReject = 'org_reject_1';
                this.centerDialogVisible = true;
                // let params = {pid:pid,method:'org_reject_1'}
                // check().then(res =>{
                //
                // })
            },
            org_pass_1() {
                console.log('org_pass_1')
                let params = {pid: this.pid, method: 'org_pass_1'}
                this.$confirm('是否核实并允许通过该审核', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    check(params).then(res => {
                        console.log(res);
                        this.$emit('chekcSuccess')
                        this.$message({
                            type: 'success',
                            message: '提交成功!'
                        });
                    }).catch(err =>{
                      this.$message({type:'error',message:err.msg+'，'+err.errors})
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消'
                    });
                });
            },
            org_reject_2(isExam) {
                console.log('org_reject_2',isExam)
                if(isExam == null){
                    this.$message({
                        type:'error',
                        message:'该用户还未报名'
                    })
                    return
                }else{
                    this.stateReject = 'org_reject_2';
                    this.centerDialogVisible = true;
                }
            },
            org_pass_2(isExam) {
                console.log('org_pass_2',isExam);
                if(isExam == null){
                    this.$message({
                        type:'error',
                        message:'该用户还未报名'
                    })
                    return
                }else{
                    let params = {pid: this.pid, method: 'org_pass_2'}
                    this.$confirm('是否核实并允许通过该审核', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        check(params).then(res => {
                            console.log(res);
                            this.$emit('chekcSuccess')
                            this.$message({
                                type: 'success',
                                message: '提交成功!'
                            });
                        }).catch(err =>{
                          this.$message({type:'error',message:err.msg+'，'+err.errors})
                        })
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消'
                        });
                    });
                }
            },
            admin_reject_1() {
                console.log('admin_reject_1');
                this.stateReject = 'admin_reject_1';
                this.centerDialogVisible = true;
            },
            admin_pass_1() {
                console.log('admin_pass_1');
                let params = {pid: this.pid, method: 'admin_pass_1'}
                this.$confirm('是否核实并允许通过该审核', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    check(params).then(res => {
                        console.log(res);
                        this.$emit('chekcSuccess')
                        this.$message({
                            type: 'success',
                            message: '提交成功!'
                        });
                    }).catch(err =>{
                      this.$message({type:'error',message:err.msg+'，'+err.errors})
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消'
                    });
                });
            },
            admin_reject_2() {
                console.log('admin_reject_2')
                this.stateReject = 'admin_reject_2';
                this.centerDialogVisible = true;
            },
            admin_pass_2() {
                console.log('admin_pass_2');
                let params = {pid: this.pid, method: 'admin_pass_2'}
                this.$confirm('是否核实并允许通过该审核', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    check(params).then(res => {
                        console.log(res);
                        this.$emit('chekcSuccess')
                        this.$message({
                            type: 'success',
                            message: '提交成功!'
                        });
                    }).catch(err =>{
                      this.$message({type:'error',message:err.msg+'，'+err.errors})
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消'
                    });
                });
            }
        }
    }
</script>

<style scoped>
    .stateButton .el-button--mini{
        padding: 7px 7px;
    }
.item{
    margin-bottom: 0px;
}
    .checkButton{
        cursor: pointer;
    }
</style>
